<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    /*.one{*/
    /*  color: red;*/
    /*}*/
  </style>
</head>
<body>
<!--  <div id="d" >sadjsdlf</div>-->
<!--  <input type="text" id="i">-->
<!--  <button type="button" onclick="test()">按钮</button>-->

 <ul>
   <li>广州恒大</li>
   <li>北京国安</li>
   <li>山东鲁能</li>
   <li>江苏绿城</li>
 </ul>
 <script>
   // function test(){
         //3cDOM可以自定义属性
     // var d =document.getElementById('d')
     // d.setAttribute('asdsd','fsdfs')

       //htmlDOM可以拿到看不见的属性值
     // var i =document.getElementById('i')
     // i.value ='sajdhka'
     // console.log(i.value)
     // console.log(i.getAttribute('value'))
   // }
   // var d =document.getElementById('d')
   // d.className='one'

   //接收到的lis为一个数组
   // var lis =document.getElementsByTagName('li')
      // for(var i=0;i<lis.length;i++){
      //    var li=lis[i]
      //     li.style.color='red'
      //     li.style.fontSize='20px'
      //     li.style.fontWeight='900'
      //     li.style.fontStyle='oblique'
      // }

     //节点查找
   var ul =document.getElementsByTagName('ul')[0]
   console.log(ul.firstElementChild)
 </script>
</body>
</html>